From 35eaca27e4e0004348e63fa63c5c125dc193c7d9 Mon Sep 17 00:00:00 2001 From: Matthias Clasen Date: Thu, 5 Nov 2015 10:38:01 -0500 Subject: [PATCH] Adwaita: Update places sidebar styling Use the new element name. --- gtk/theme/Adwaita/_common.scss | 23 ++++++--------------- gtk/theme/Adwaita/gtk-contained-dark.css | 26 +++++++++++++++++++----- gtk/theme/Adwaita/gtk-contained.css | 26 +++++++++++++++++++----- 3 files changed, 48 insertions(+), 27 deletions(-) diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss index f48dd78511..938264b113 100644 --- a/gtk/theme/Adwaita/_common.scss +++ b/gtk/theme/Adwaita/_common.scss @@ -2503,6 +2503,7 @@ actionbar frame { border-width: 1px 0 0; } +placessidebar, scrolledwindow { viewport.frame { // avoid double borders when viewport inside scrolled window border-style: none; @@ -2530,21 +2531,10 @@ scrolledwindow { // Overflow indication, works similarly to the overshoot, the size if fixed tho. undershoot { - &.top { - @include undershoot(top); - } - - &.bottom { - @include undershoot(bottom); - } - - &.left { - @include undershoot(left); - } - - &.right { - @include undershoot(right); - } + &.top { @include undershoot(top); } + &.bottom { @include undershoot(bottom); } + &.left { @include undershoot(left); } + &.right { @include undershoot(right); } } junction { // the small square between two scrollbars @@ -2560,7 +2550,6 @@ scrolledwindow { background-color: $backdrop_scrollbar_bg_color; } } - } //vbox and hbox separators @@ -2911,7 +2900,7 @@ GtkSidebarRow { } } -GtkPlacesSidebar.sidebar { +placessidebar { // in the sidebar case it makes no sense to click the selected row .list-row:selected:active { box-shadow: none; } diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css index bc34cdff09..385ef5a1da 100644 --- a/gtk/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/theme/Adwaita/gtk-contained-dark.css @@ -3512,8 +3512,10 @@ actionbar frame { padding: 6px; border-width: 1px 0 0; } +placessidebar viewport.frame, scrolledwindow viewport.frame { border-style: none; } +placessidebar overshoot.top, scrolledwindow overshoot.top { background-image: -gtk-gradient(radial, center top, 0, center top, 0.5, to(#040404), to(rgba(4, 4, 4, 0))), -gtk-gradient(radial, center top, 0, center top, 0.6, from(rgba(238, 238, 236, 0.07)), to(rgba(238, 238, 236, 0))); background-size: 100% 5%, 100% 100%; @@ -3522,6 +3524,7 @@ scrolledwindow overshoot.top { background-color: transparent; border: none; box-shadow: none; } + placessidebar overshoot.top:backdrop, scrolledwindow overshoot.top:backdrop { background-image: -gtk-gradient(radial, center top, 0, center top, 0.5, to(#1f2222), to(rgba(31, 34, 34, 0))); background-size: 100% 5%; @@ -3530,6 +3533,7 @@ scrolledwindow overshoot.top { background-color: transparent; border: none; box-shadow: none; } +placessidebar overshoot.bottom, scrolledwindow overshoot.bottom { background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#040404), to(rgba(4, 4, 4, 0))), -gtk-gradient(radial, center bottom, 0, center bottom, 0.6, from(rgba(238, 238, 236, 0.07)), to(rgba(238, 238, 236, 0))); background-size: 100% 5%, 100% 100%; @@ -3538,6 +3542,7 @@ scrolledwindow overshoot.bottom { background-color: transparent; border: none; box-shadow: none; } + placessidebar overshoot.bottom:backdrop, scrolledwindow overshoot.bottom:backdrop { background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#1f2222), to(rgba(31, 34, 34, 0))); background-size: 100% 5%; @@ -3546,6 +3551,7 @@ scrolledwindow overshoot.bottom { background-color: transparent; border: none; box-shadow: none; } +placessidebar overshoot.left, scrolledwindow overshoot.left { background-image: -gtk-gradient(radial, left center, 0, left center, 0.5, to(#040404), to(rgba(4, 4, 4, 0))), -gtk-gradient(radial, left center, 0, left center, 0.6, from(rgba(238, 238, 236, 0.07)), to(rgba(238, 238, 236, 0))); background-size: 5% 100%, 100% 100%; @@ -3554,6 +3560,7 @@ scrolledwindow overshoot.left { background-color: transparent; border: none; box-shadow: none; } + placessidebar overshoot.left:backdrop, scrolledwindow overshoot.left:backdrop { background-image: -gtk-gradient(radial, left center, 0, left center, 0.5, to(#1f2222), to(rgba(31, 34, 34, 0))); background-size: 5% 100%; @@ -3562,6 +3569,7 @@ scrolledwindow overshoot.left { background-color: transparent; border: none; box-shadow: none; } +placessidebar overshoot.right, scrolledwindow overshoot.right { background-image: -gtk-gradient(radial, right center, 0, right center, 0.5, to(#040404), to(rgba(4, 4, 4, 0))), -gtk-gradient(radial, right center, 0, right center, 0.6, from(rgba(238, 238, 236, 0.07)), to(rgba(238, 238, 236, 0))); background-size: 5% 100%, 100% 100%; @@ -3570,6 +3578,7 @@ scrolledwindow overshoot.right { background-color: transparent; border: none; box-shadow: none; } + placessidebar overshoot.right:backdrop, scrolledwindow overshoot.right:backdrop { background-image: -gtk-gradient(radial, right center, 0, right center, 0.5, to(#1f2222), to(rgba(31, 34, 34, 0))); background-size: 5% 100%; @@ -3578,6 +3587,7 @@ scrolledwindow overshoot.right { background-color: transparent; border: none; box-shadow: none; } +placessidebar undershoot.top, scrolledwindow undershoot.top { background-color: transparent; background-image: linear-gradient(to left, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%); @@ -3588,6 +3598,7 @@ scrolledwindow undershoot.top { background-position: center top; border: none; box-shadow: none; } +placessidebar undershoot.bottom, scrolledwindow undershoot.bottom { background-color: transparent; background-image: linear-gradient(to left, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%); @@ -3598,6 +3609,7 @@ scrolledwindow undershoot.bottom { background-position: center bottom; border: none; box-shadow: none; } +placessidebar undershoot.left, scrolledwindow undershoot.left { background-color: transparent; background-image: linear-gradient(to top, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%); @@ -3608,6 +3620,7 @@ scrolledwindow undershoot.left { background-position: left center; border: none; box-shadow: none; } +placessidebar undershoot.right, scrolledwindow undershoot.right { background-color: transparent; background-image: linear-gradient(to top, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%); @@ -3618,12 +3631,15 @@ scrolledwindow undershoot.right { background-position: right center; border: none; box-shadow: none; } +placessidebar junction, scrolledwindow junction { border-color: transparent; border-image: linear-gradient(to bottom, #1c1f1f 1px, transparent 1px) 0 0 0 1/0 1px stretch; background-color: #282c2c; } + placessidebar junction:dir(rtl), scrolledwindow junction:dir(rtl) { border-image-slice: 0 1 0 0; } + placessidebar junction:backdrop, scrolledwindow junction:backdrop { border-image-source: linear-gradient(to bottom, #1f2222 1px, transparent 1px); background-color: #323737; } @@ -4108,11 +4124,11 @@ GtkSidebarRow .sidebar-label:dir(ltr) { GtkSidebarRow .sidebar-label:dir(rtl) { padding-left: 2px; } -GtkPlacesSidebar.sidebar .list-row:selected:active { +placessidebar .list-row:selected:active { box-shadow: none; } -GtkPlacesSidebar.sidebar .sidebar-placeholder-row { +placessidebar .sidebar-placeholder-row { border: solid 1px #215d9c; } -GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row { +placessidebar .sidebar-new-bookmark-row { color: #215d9c; } .sidebar-button.button { border-radius: 100%; @@ -4504,7 +4520,7 @@ calendar:selected, label:selected, label:selected:focus, label:selected:hover, . textview text:insensitive:selected, .view:insensitive:selected, calendar:insensitive:selected, label:insensitive:selected, .grid-child:insensitive:selected, entry:insensitive:selected, spinbutton:insensitive:selected, modelbutton.flat:insensitive:selected, - .menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive label { + .menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, placessidebar .list-row:selected:insensitive label { color: #90aece; } textview text:backdrop:selected, .view:backdrop:selected, @@ -4514,7 +4530,7 @@ calendar:selected, label:selected, label:selected:focus, label:selected:hover, . textview text:backdrop:insensitive:selected, .view:backdrop:insensitive:selected, calendar:backdrop:insensitive:selected, label:backdrop:insensitive:selected, .grid-child:backdrop:insensitive:selected, entry:backdrop:insensitive:selected, spinbutton:backdrop:insensitive:selected, modelbutton.flat:backdrop:insensitive:selected, - .menuitem.button.flat:backdrop:insensitive:selected, .list-row:backdrop:insensitive:selected, .sidebar:backdrop:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive label:backdrop, GtkPlacesSidebar.sidebar .list-row:selected:backdrop:insensitive label { + .menuitem.button.flat:backdrop:insensitive:selected, .list-row:backdrop:insensitive:selected, .sidebar:backdrop:insensitive:selected, placessidebar .list-row:selected:insensitive label:backdrop, placessidebar .list-row:selected:backdrop:insensitive label { color: #648eba; } .monospace { diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css index 1c085eb8b9..6aa88a9086 100644 --- a/gtk/theme/Adwaita/gtk-contained.css +++ b/gtk/theme/Adwaita/gtk-contained.css @@ -3674,8 +3674,10 @@ actionbar frame { padding: 6px; border-width: 1px 0 0; } +placessidebar viewport.frame, scrolledwindow viewport.frame { border-style: none; } +placessidebar overshoot.top, scrolledwindow overshoot.top { background-image: -gtk-gradient(radial, center top, 0, center top, 0.5, to(#878787), to(rgba(135, 135, 135, 0))), -gtk-gradient(radial, center top, 0, center top, 0.6, from(rgba(46, 52, 54, 0.07)), to(rgba(46, 52, 54, 0))); background-size: 100% 5%, 100% 100%; @@ -3684,6 +3686,7 @@ scrolledwindow overshoot.top { background-color: transparent; border: none; box-shadow: none; } + placessidebar overshoot.top:backdrop, scrolledwindow overshoot.top:backdrop { background-image: -gtk-gradient(radial, center top, 0, center top, 0.5, to(darkgray), to(rgba(169, 169, 169, 0))); background-size: 100% 5%; @@ -3692,6 +3695,7 @@ scrolledwindow overshoot.top { background-color: transparent; border: none; box-shadow: none; } +placessidebar overshoot.bottom, scrolledwindow overshoot.bottom { background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#878787), to(rgba(135, 135, 135, 0))), -gtk-gradient(radial, center bottom, 0, center bottom, 0.6, from(rgba(46, 52, 54, 0.07)), to(rgba(46, 52, 54, 0))); background-size: 100% 5%, 100% 100%; @@ -3700,6 +3704,7 @@ scrolledwindow overshoot.bottom { background-color: transparent; border: none; box-shadow: none; } + placessidebar overshoot.bottom:backdrop, scrolledwindow overshoot.bottom:backdrop { background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(darkgray), to(rgba(169, 169, 169, 0))); background-size: 100% 5%; @@ -3708,6 +3713,7 @@ scrolledwindow overshoot.bottom { background-color: transparent; border: none; box-shadow: none; } +placessidebar overshoot.left, scrolledwindow overshoot.left { background-image: -gtk-gradient(radial, left center, 0, left center, 0.5, to(#878787), to(rgba(135, 135, 135, 0))), -gtk-gradient(radial, left center, 0, left center, 0.6, from(rgba(46, 52, 54, 0.07)), to(rgba(46, 52, 54, 0))); background-size: 5% 100%, 100% 100%; @@ -3716,6 +3722,7 @@ scrolledwindow overshoot.left { background-color: transparent; border: none; box-shadow: none; } + placessidebar overshoot.left:backdrop, scrolledwindow overshoot.left:backdrop { background-image: -gtk-gradient(radial, left center, 0, left center, 0.5, to(darkgray), to(rgba(169, 169, 169, 0))); background-size: 5% 100%; @@ -3724,6 +3731,7 @@ scrolledwindow overshoot.left { background-color: transparent; border: none; box-shadow: none; } +placessidebar overshoot.right, scrolledwindow overshoot.right { background-image: -gtk-gradient(radial, right center, 0, right center, 0.5, to(#878787), to(rgba(135, 135, 135, 0))), -gtk-gradient(radial, right center, 0, right center, 0.6, from(rgba(46, 52, 54, 0.07)), to(rgba(46, 52, 54, 0))); background-size: 5% 100%, 100% 100%; @@ -3732,6 +3740,7 @@ scrolledwindow overshoot.right { background-color: transparent; border: none; box-shadow: none; } + placessidebar overshoot.right:backdrop, scrolledwindow overshoot.right:backdrop { background-image: -gtk-gradient(radial, right center, 0, right center, 0.5, to(darkgray), to(rgba(169, 169, 169, 0))); background-size: 5% 100%; @@ -3740,6 +3749,7 @@ scrolledwindow overshoot.right { background-color: transparent; border: none; box-shadow: none; } +placessidebar undershoot.top, scrolledwindow undershoot.top { background-color: transparent; background-image: linear-gradient(to left, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%); @@ -3750,6 +3760,7 @@ scrolledwindow undershoot.top { background-position: center top; border: none; box-shadow: none; } +placessidebar undershoot.bottom, scrolledwindow undershoot.bottom { background-color: transparent; background-image: linear-gradient(to left, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%); @@ -3760,6 +3771,7 @@ scrolledwindow undershoot.bottom { background-position: center bottom; border: none; box-shadow: none; } +placessidebar undershoot.left, scrolledwindow undershoot.left { background-color: transparent; background-image: linear-gradient(to top, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%); @@ -3770,6 +3782,7 @@ scrolledwindow undershoot.left { background-position: left center; border: none; box-shadow: none; } +placessidebar undershoot.right, scrolledwindow undershoot.right { background-color: transparent; background-image: linear-gradient(to top, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%); @@ -3780,12 +3793,15 @@ scrolledwindow undershoot.right { background-position: right center; border: none; box-shadow: none; } +placessidebar junction, scrolledwindow junction { border-color: transparent; border-image: linear-gradient(to bottom, #a1a1a1 1px, transparent 1px) 0 0 0 1/0 1px stretch; background-color: #dbdbdb; } + placessidebar junction:dir(rtl), scrolledwindow junction:dir(rtl) { border-image-slice: 0 1 0 0; } + placessidebar junction:backdrop, scrolledwindow junction:backdrop { border-image-source: linear-gradient(to bottom, darkgray 1px, transparent 1px); background-color: #e5e5e5; } @@ -4280,11 +4296,11 @@ GtkSidebarRow .sidebar-label:dir(ltr) { GtkSidebarRow .sidebar-label:dir(rtl) { padding-left: 2px; } -GtkPlacesSidebar.sidebar .list-row:selected:active { +placessidebar .list-row:selected:active { box-shadow: none; } -GtkPlacesSidebar.sidebar .sidebar-placeholder-row { +placessidebar .sidebar-placeholder-row { border: solid 1px #4a90d9; } -GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row { +placessidebar .sidebar-new-bookmark-row { color: #4a90d9; } .sidebar-button.button { border-radius: 100%; @@ -4677,7 +4693,7 @@ calendar:selected, label:selected, label:selected:focus, label:selected:hover, . textview text:insensitive:selected, .view:insensitive:selected, calendar:insensitive:selected, label:insensitive:selected, .grid-child:insensitive:selected, entry:insensitive:selected, spinbutton:insensitive:selected, modelbutton.flat:insensitive:selected, - .menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive label { + .menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, placessidebar .list-row:selected:insensitive label { color: #a5c8ec; } textview text:backdrop:selected, .view:backdrop:selected, @@ -4687,7 +4703,7 @@ calendar:selected, label:selected, label:selected:focus, label:selected:hover, . textview text:backdrop:insensitive:selected, .view:backdrop:insensitive:selected, calendar:backdrop:insensitive:selected, label:backdrop:insensitive:selected, .grid-child:backdrop:insensitive:selected, entry:backdrop:insensitive:selected, spinbutton:backdrop:insensitive:selected, modelbutton.flat:backdrop:insensitive:selected, - .menuitem.button.flat:backdrop:insensitive:selected, .list-row:backdrop:insensitive:selected, .sidebar:backdrop:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive label:backdrop, GtkPlacesSidebar.sidebar .list-row:selected:backdrop:insensitive label { + .menuitem.button.flat:backdrop:insensitive:selected, .list-row:backdrop:insensitive:selected, .sidebar:backdrop:insensitive:selected, placessidebar .list-row:selected:insensitive label:backdrop, placessidebar .list-row:selected:backdrop:insensitive label { color: #80b1e4; } .monospace { -- 2.30.2